<template>
  <div>
    <el-form ref="pram" :model="pram" :rules="rules" label-width="125px" @submit.native.prevent>
      <el-row>
        <el-col :span="8">
          <el-form-item label="年度" prop="year">
            <div class="block">
              <el-date-picker
                v-model="pram.year"
                type="year"
                value-format="yyyy"
                placeholder="选择年"
                style="width:100%"
              >
              </el-date-picker>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="型号" prop="modelUnit">
            <el-input v-model="pram.modelUnit" maxlength="100" placeholder="装备型号"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所属单位" prop="taskName">
            <el-cascader v-model="pram.departmentId" :disabled="pram.departmentId ===0" :options="parentOptions"
                         :props="categoryProps" style="width:100%"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="试验日期" prop="testTime">
            <el-date-picker v-model="pram.testTime" value-format="yyyy-MM-dd" format="yyyy-MM-dd" size="small"
                            type="date" placement="bottom-end" style="width: 100%;" @change="onchangeSTime"
                            placeholder="试验日期"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验类型" prop="testType">
            <el-input v-model="pram.testType" maxlength="100" placeholder="试验类型"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验科目" prop="testSubject">
            <el-input v-model="pram.testSubject" maxlength="100" placeholder="试验科目"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="问题原因" prop="testCondition">
            <el-input v-model="pram.testCondition" maxlength="100" placeholder="问题原因"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="试验结果" prop="testResult">
            <el-input v-model="pram.testResult" maxlength="100" placeholder="试验结果"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="故障处理" prop="testFault">
            <el-input v-model="pram.testFault" maxlength="100" type="textarea" :rows="2" placeholder="故障处理"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="故障分析定位" prop="testFaultAnalysis">
            <el-input v-model="pram.testFaultAnalysis" type="textarea" :rows="5"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="解决方式" prop="faultSolution">
            <el-input v-model="pram.faultSolution" type="textarea" :rows="5"/>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="遗留问题" prop="remainingProblems">
            <el-input v-model="pram.remainingProblems" type="textarea" :rows="5"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="改进意见建议" prop="recommendation">
            <el-input v-model="pram.recommendation" type="textarea" :rows="5"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="归零评审日期" prop="reviewTime">
            <el-date-picker v-model="pram.reviewTime" value-format="yyyy-MM-dd" format="yyyy-MM-dd" size="small"
                            type="date" placement="bottom-end" style="width: 100%;" @change="onchangeSTime2"
                            placeholder="试验日期"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="序号">
            <el-input-number v-model="pram.number" :min="0"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item>
        <el-button type="primary" @click="handlerSubmit('pram')"
        >{{ isCreate === 0 ? '确定' : '更新' }}
        </el-button>
        <el-button @click="close">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import * as testsApi from '@/api/tests'
import { Debounce } from '@/utils/validate'

export default {
  components: {},
  props: {
    isCreate: {
      type: Number,
      required: true
    },
    id: {
      type: Number,
      required: true
    },
    allCategoryData: {
      type: Object
    },
    allTreeList: {
      type: Array
    }
  },
  data() {
    return {
      constants: this.$constants,
      pram: {
        year: null,
        modelUnit: null,
        testType: null,
        testSubject: null,
        testTime: null,
        testCondition: null,
        testResult: null,
        testFault: null,
        testFaultAnalysis: null,
        faultSolution: null,
        reviewTime: null,
        number: null,
        departmentId: '',
        remainingProblems: null,
        recommendation: null,
        id: 0
      },
      rules: {
        // name: [{ required: true, message: '请填设备名称', trigger: ['blur', 'change'] }],
        // brand: [{ required: true, message: '请选择设备品牌', trigger: ['blur', 'change'] }],
        // device: [{ required: true, message: '请选择设备型号', trigger: ['blur', 'change'] }],
        // deviceType: [{ required: true, message: '请选择设备类型', trigger: ['blur', 'change'] }],
        // personId: [ { required: true, message: '请选择所属人', trigger: ['blur', 'change']} ],
        // serialization: [ { required: true, message: '请填机身串码', trigger: ['blur', 'change']} ],
        // mobile: [ { required: true, message: '请填手机号', trigger: ['blur', 'change']} ],
        // macAddress: [ { required: true, message: '请填Mac地址', trigger: ['blur', 'change']} ],
        // bluetoothAddress: [ { required: true, message: '请填蓝牙通讯地址', trigger: ['blur', 'change']} ],
      },
      parentOptions: [],
      categoryProps: {
        value: 'id',
        label: 'name',
        children: 'child',
        expandTrigger: 'hover',
        checkStrictly: true,
        emitPath: false
      },
      categoryData: {
        brandList: [],
        deviceList: [],
        deviceTypeList: [],
        personList: []
      },
      deviceList: []
    }
  },
  mounted() {
    this.initEditData()
  },
  methods: {
    close() {
      this.$emit('hideEditDialog')
    },
    onchangeSTime(e) {
      this.pram.testTime = e
    },
    onchangeSTime2(e) {
      this.pram.reviewTime = e
    },
    initEditData() {
      this.parentOptions = [...this.allTreeList]
      if (this.isCreate === 1) {
        this.getTestsFailure()
      }

    },
    getTestsFailure() {
      testsApi.getTestsRecordApi({ id: this.id }).then(data => {
        if (data) {
          this.pram = data
        }

      })
    },
    handlerSubmit: Debounce(function(form) {
      this.$refs[form].validate(valid => {
        if (!valid) return
        if (this.isCreate === 0) {
          this.handlerSave()
        } else {
          this.handlerEdit()
        }
      })
    }),
    handlerSave() {
      testsApi.editTestsRecordAip(this.pram).then(data => {
        this.$message.success('创建设备成功')
        this.$emit('hideEditDialog')
      })
    },
    handlerEdit() {
      testsApi.editTestsRecordAip(this.pram).then(data => {
        this.$message.success('更新设备成功')
        this.$emit('hideEditDialog')
      })
    }
  }
}
</script>

<style scoped>

</style>
